(function($){
    
    var _floatCardTmp = [
            '<div class="<%=o.theme%>"></div>'
        ].join(''),    
        _defaultConfig = {};
    
    //---------------------------------------------------------------------------------
    
    var FloatCard = function(config){
        var _this = this;
        Observable.enable(this);
        this.config = $.extend({}, _defaultConfig, config);
        this.$wrapper = $(tmpl(_floatCardTmp, this.config));
        this.$wrapper.addClass('floatCard');                
        this.$wrapper.style(this.config['style']);
    }.extend(ujs.ui.Component);
    
    FloatCard.create = function(config){
        return new FloatCard(config);
    };
    
    //---------------------------------------------------------------------------------
    
    FloatCard.prototype.render = FloatCard.prototype.renderTo = function($holder){
        $holder = $($holder || document.body);
        this.$holder = $holder;
        this.$wrapper.appendTo($holder);
        return this;
    };
    
    FloatCard.prototype.setContent = function(contentHtml){
        this.$wrapper.html('').append(contentHtml);
        return this;
    };
    
    //---------------------------------------------------------------------------------
    
    //init interface.
    $.fn.floatCard = function(config){        
        this.each(function(){
            var floatCardObj = new FloatCard(config);    
            floatCardObj.renderTo(this);                           
            $(this).data('floatCard', floatCardObj);
        });
        return this;
    };
    
    $.FloatCard = FloatCard;
    
})(jQuery);